<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/mstyle.css" />
	</head>
	<body class="news">
		<!--navBar-->
		<header class="mui-bar mui-bar-nav">
			<h1 class="mui-title">资讯</h1>
		</header>
		<!--container-->
		<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
		  	<div class="mui-scroll">
		   	 	<!--数据列表-->
		    	<ul class="newsList mui-table-view mui-table-view-chevron" id="innerCont"></ul>
		  	</div>
		</div>
		<ul class="newsList mui-content" id="cont" style="display: none;"></ul>
		<script type='text/template' id="temp">
			{%for(var i=0;i<data.length;i++){%}
			<li class="mui-clearfix" data-id='{%=data[i].id%}'>
				<div class="wrap mui-pull-left">
					<h3>{%=data[i].title%}</h3>
					<p class="source">{%=data[i].source%}</p>
					<p class="time">{%=data[i].createTime%}</p>
				</div>
				<img src="{%=host+data[i].imgCover%}" alt="" class="despic mui-pull-right"/>
			</li>
			{%}%}
		</script>
		<!--tabBar-->
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item" data-page='marketPage' href="#">
				<img src="images/HQ_icon_21x21_@3x.png" alt="" />
				<span>行情</span>
			</a>
			<a class="mui-tab-item mui-active" data-page='optionalPage' href="#">
				<img src="images/ZX_icon_21x21_@3x.png" alt="" />
				<span>自选</span>
			</a>
			<a class="mui-tab-item " data-page='newsPage' href="#">
				<img src="images/news_selected.png" alt="" />
				<span class="activeBar">资讯</span>
			</a>
			<a class="mui-tab-item " data-page='tradePage' href="#">
				<img src="images/JY_icon_21x21_@2x.png" alt="" />
				<span>交易</span>
			</a>
			<a href="javascript:void(0)" class="mui-tab-item" data-page='centerPage'>
				<img src="images/WD_icon_21x21_@3x.png" alt="" />
				<span>我的</span>
			</a>
		</nav>
		<script src="js/mui.min.js"></script>
		<script src="js/webviewGroup.js" type="text/javascript" charset="utf-8"></script>
		<script src='libs/easymob-webim-sdk/jquery-1.11.1.js'></script>
		<script src='js/config.js'></script>
		<script src='js/temp.js'></script>
		<script src='js/mstock.js'></script>
		<script type="text/javascript"> 
		//mui.init();
			mui.init({
			  	pullRefresh:{
			    	container:'#refreshContainer',//待刷新区域标识，querySelector能定位的css选择器均可，比如：id、.class等
			   		up: {
				      	height:50,//可选.默认50.触发上拉加载拖动距离
				      	auto:true, //可选,默认false.自动上拉加载一次
				      	contentrefresh: "正在加载...",//可选，正在加载状态时，上拉加载控件上显示的标题内容
				      	contentnomore:'没有更多数据了',//可选，请求完毕若没有更多数据时显示的提醒内容；
				      	callback:pullfreshFunction//必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
			   		},
			   		down : {
				      	height:50,//可选,默认50.触发下拉刷新拖动距离,
			      		auto: false,//可选,默认false.首次加载自动下拉刷新一次
				      	contentdown : "下拉刷新",//可选，在下拉可刷新状态时，下拉刷新控件上显示的标题内容
				      	contentover : "释放立即刷新",//可选，在释放可刷新状态时，下拉刷新控件上显示的标题内容
				      	contentrefresh : "正在刷新...",//可选，正在刷新状态时，下拉刷新控件上显示的标题内容
				     	callback :regetFunction //必选，刷新函数，根据具体业务来编写，比如通过ajax从服务器获取新数据；
					}
			  	},
			});
			var _data = {
				account:account,
				action:'newsInfo',
				app:'app',
				page:0,
				pageSize:10
			}
			function regetFunction() {
				var ths  = this;
				var _data = {
					account:account,
					action:'newsInfo',
					app:'app',
					page:0,
					pageSize:10
				}
				jQuery.ajax({
					type:'post',
					url:server.optSel,
					data:_data,
					dataType:'json',
					success:function(result){
						if(result.code==0){
							console.log(result)
							var data = result.data.list;
							jo.reTpl(jQuery('#temp'),{data:data},jQuery('#cont'));
							var dom = jQuery('#cont').html();
							jQuery('#innerCont').empty().append(dom);
							mui('#refreshContainer').pullRefresh().endPulldownToRefresh();
						}else{
							mui.toast(result.msg);
						}
					},
					error:function(result){
						console.log(result);
					}
				})
			}
			function pullfreshFunction() {
				_data.page = _data.page+1
				var ths = this;
				jQuery.ajax({
					type:'post',
					url:server.optSel,
					data:_data,
					dataType:'json',
					success:function(result){
						if(result.code==0){
							console.log(result)
							var data = result.data.list;
							jo.reTpl(jQuery('#temp'),{data:data},jQuery('#cont'));
							var dom = jQuery('#cont').html();
							jQuery('#innerCont').append(dom)
							var endorNot = !result.data.hasNextPage;
							ths.endPullupToRefresh(endorNot);
						}else{
							mui.toast(result.msg);
						}
					},
					error:function(result){
						console.log(result);
					}
				})
			}
			mstcok().tabBarFun();
			mui('#innerCont').on('tap','li',function(){
				var  _id = jQuery(this).attr('data-id');
				mui.openWindow({
					url:'newsInfo.html?id='+_id,
					id:'newsInfo.html'
				})
			})
		</script>
	</body>
</html>